
import VueRouter from 'vue-router'
import Vue from 'vue'
// 1. Define route components.
// These can be imported from other files
// const Home = { template: '<div>Home</div>' }
// const About = { template: '<div>About</div>' }
const Home = () => import('../components/Home')
const About = () => import('../components/About')
const notFound = () => import('../components/404')


// 2. Define some routes
// Each route should map to a component.
// We'll talk about nested routes later.
const routes = [
  { path: '/', component: Home },
  { path: '/about', component: About },
  { path: '*', component: notFound },
]

Vue.use(VueRouter)

// 3. Create the router instance and pass the `routes` option
// You can pass in additional options here, but let's
// keep it simple for now.
// const router = VueRouter.createRouter({
//   // 4. Provide the history implementation to use. We are using the hash history for simplicity here.
//   history: VueRouter.createWebHashHistory(),
//   mode: 'history',
//   routes, // short for `routes: routes`
// })

export default () => {
  console.log('VueRouter.createWebHashHistory', VueRouter.createWebHashHistory)
  const router = new VueRouter({
    // history: VueRouter.createWebHashHistory(),
    mode: 'history',
    routes, // short for `routes: routes`
  })
  // const router = VueRouter.createRouter({
  //   history: VueRouter.createWebHashHistory(),
  //   mode: 'history',
  //   routes, // short for `routes: routes`
  // })
  return  router
}

// 5. Create and mount the root instance.
// const app = Vue.createApp({})
// // Make sure to _use_ the router instance to make the
// // whole app router-aware.
// app.use(router)

// app.mount('#app')

// Now the app has started!